<template>
  <div class="page">
    <c-title :hide="false" text="缘链生态馆"></c-title>
    <sjrz :name="'缘链生态帮扶馆'"></sjrz>
    <div class="top">
      <U_location :datas="address" />
      <i class="iconfont icon-order_locate"></i>
      <div class="van-ellipsis" @click="tolocation">{{ addresss || "暂未获取到地址" }}1</div>
      <van-search v-model="suosuo" shape="round" placeholder="请输入搜索关键词" />
    </div>
    <van-swipe class="my-swipe" :autoplay="3000">
      <van-swipe-item v-for="(item, index) in pricList" :key="index"><img :src="item.thumb" /></van-swipe-item>
    </van-swipe>
    <div class="content">
      <h3>最 新 动 态</h3>
      <van-swipe class="my-swipe" :autoplay="3000" vertical style="height: 1rem" :show-indicators="false">
        <van-swipe-item v-for="(item, index) in wzList" :key="index">
          <van-col span="4" style="float: left; width: 50%; text-align: left">{{ item.title }}</van-col>
          <van-col span="4" style="float: right" class="xq" @click="xq(item.id)">查看详情</van-col></van-swipe-item
        >
      </van-swipe>
    </div>
    <div class="middle">
      <img src="../../assets/images/ylstgmiddle.png" alt="" @click="gourl" />
    </div>
    <div class="bottom">
      <h3>省 份 列 表</h3>
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
        <div v-for="(item, index) in arrArea" :key="index" @click="getzhuan(item.id)">
          <div v-if="item.thumb!='' ">
            <div class="name">{{ item.areaname }}</div>
          </div>
          <div class="img" v-if="item.thumb!=''    ">
            <img :src="item.thumb"/>
          </div>
        </div>
      </van-list>
    </div>
  </div>
</template>
<script>
import { areaList } from "@vant/area-data";
import { Toast } from "vant";
import sjrz from "components/sjrz";
export default {
  components: {
    sjrz
  },
  data() {
    return {
      suosuo: null,
      addresss: null,
      streetNumber: null,
      finished: false,
      loading: false,
      arrArea: [], //地址
      province_id: null, //省id
      pricList: [], //图片
      wzList: [], //文章
      address: [], //地址
    };
  },
  activated() {
    this.addresss = this.$route.query.city;
    // this.getList();
    this.getwz();
    this.getpic();
    this.gitsheng();
    this.fun
      .getLocation()
      .then(res => {
        this.addresss = res.addressComponent.street;
        this.streetNumber = res.addressComponent.streetNumber;
      })
      .catch(err => {
        console.log(err);
      });
  },
  methods: {
    onLoad() {
      console.log("123")
      setTimeout(() => {
        this.gitsheng();
        this.loading = true;
      }, 500);
    },
    gourl() {
      this.$router.push(this.fun.getUrl("CourseIndex"));
    },
    tolocation() {
      this.$router.push(
        this.fun.getUrl(
          "o2oLocation",
          {},
          {
            name: "ylstg"
          }
        )
      );
    },
    gomd(id) {
      this.$router.push(
        this.fun.getUrl("hftdiy", {
          store_id: id
        })
      );
    },
	  tolocation() {
	    this.$router.push(this.fun.getUrl('o2oLocation',{},{
			name:'ylstg'
		}));
	  },
	  gomd(id){
		  this.$router.push(
		    this.fun.getUrl("hftdiy", {
		      store_id: id
		    }, {
		      store_id: id
		    })
		  );
	  },
    gitsheng() {
      $http.post("plugin.store-cashier.frontend.store.new.get-sheng", {
          limit: 10,
          page: this.page
        })
        .then(response => {
          this.arrArea = response.data.list;
            this.finished = true;
          this.page++;
          if (this.arrArea.length === 0) {
            this.finished = true;
          }
          console.log(this.arrArea);
        });
    },
    getzhuan(province_id) {
      console.log(province_id);
      this.$router.push(this.fun.getUrl("menlist", {}, { province_id }));
    },
    getpic() {
      $http
        .post("plugin.store-cashier.frontend.store.store-picture.get-list", {
          category_id: 1
        })
        .then(response => {
          this.pricList = response.json;
        });
    },
    xq(act_id) {
      this.$router.push(this.fun.getUrl("wzxq", {}, { act_id }));
    },

    getwz() {
      $http
        .post("plugin.store-cashier.frontend.store.store-article.get-list", {
          category_id: 1
        })
        .then(response => {
          this.wzList = response.json;
        });
    },
 
  }
};
</script>
<style scoped lang="scss">
.my-swipe .van-swipe-item {
  img {
    height: 10rem;
    width: 100%;
  }
}
.content {
  margin: 0.5rem 0rem;
  border-radius: 1rem;
  padding-bottom: 1rem;
  .my-swipe {
    line-height: 1rem;
  }
  h3 {
    margin: 1rem 0;
  }
  .xq {
    color: #1989fa;
  }
  .van-row {
    margin-bottom: 1rem;
  }
}

.top {
  display: flex;
  i {
    margin: 4% 0.5rem;
  }
  .van-search {
    background-color: #f7f8fa;
    width: 100%;
    .van-search__content {
      background: #fff;
    }
  }

  .van-ellipsis {
    font-size: 0.9rem;
    margin-top: 4%;
    width: 6rem;
  }
  .van-cell-group--inset {
    border-radius: 3rem;
    margin: 1.3% 0%;
    width: 14rem;
  }
}
.middle {
  img {
    height: 6rem;
  }
}
.bottom {
  .title{
    font-size: 1.1rem;
  }
    .name {
    position: relative;
    top: 6rem;
    font-weight: 600;
  }
  .img {
    display: flex;
    img {
      width: 100%;
    height: 11rem;
    }
  }
}
</style>